<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>import page</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <div th:include="common :: common-jquery"></div>
    <div th:include="common :: common-bootstrap"></div>
</head>
<body>
<div  th:id="container" >

    <div class="row">
        <div class="col-md-4 col-sm-4"></div>
        <div class="col-md-4 col-sm-4">
            <h2> POI 文件 import</h2>
            <form th:action="@{/poi/import}" method="post" enctype="multipart/form-data">
                <div class="form-group">
                    <input type="file" name="file" id="exampleInputFile1">
                    <input type="text" name="userId" id="userId" th:value="111111">
                    <input type="text" name="batchNo" id="batchNo" th:value="123456">
                </div>
          <!--      <button type="submit" class="btn btn-primary">上传</button>-->
                <button onclick="upload();" type="button" class="btn btn-primary" id="submit1">上传</button>
            </form>
        </div>
        <div class="col-md-4 col-sm-4"></div>
    </div>

    <div class="row">
        <div class="col-md-4 col-sm-4"></div>
        <div class="col-md-4 col-sm-4">
            <h2> POI 文件 import</h2>
            <form th:action="@{/poi/import1}" method="post" enctype="multipart/form-data">
                <div class="form-group">
                    <input type="file" name="file" id="exampleInputFile2">
                    <input type="text" name="userId" id="userId1" th:value="231">
                </div>
                <button type="submit" class="btn btn-primary">上传</button>
            </form>
        </div>
        <div class="col-md-4 col-sm-4"></div>
    </div>

    <script>
        function upload() {
            let formData = new FormData();//表单id
            formData.append("file", $("#exampleInputFile1")[0].files[0]);
            formData.append("userId", $("#userId").val())
            formData.append("batchNo", $("#batchNo").val())
            console.log($("#exampleInputFile1")[0].files[0])
            $.ajax({
                type: 'post',
                processData: false,//这个必须有，不然会报错
                contentType: false,//这个必须有，不然会报错
                data: formData,
                url: 'http://localhost:8060/poi/import',
                cache: false,
                dataType: 'json',
                beforeSend: function (XMLHttpRequest) {
                    XMLHttpRequest.setRequestHeader("userId",11);
                    XMLHttpRequest.setRequestHeader("batchNo","2");
                },
                success: function (data) {
                    console.log(data)
                }
            });
        }

    </script>

</div>
</body>
</html>
